<template>
    <div class="count">
        <h2>我是count组件</h2>
        <button @click="changeCounrt(1)">累加</button>
        <button @click="add">查看组件的实例</button>
        <p >子组件展示{{count}}</p>
    </div>
</template>

<script>
    export default {
        name:"Count",
        data(){
            return {
                // 这个方式改不了父组件数据
                // 要直接修改可以使用data或者计算数据进行接受，但是这样就不能影响父组件的数据
                count1:this.count,
            }
        },
        props:["count","changeCounrt"],
        methods:{
            add(){
                console.log(this);
                console.log(this.count);
                console.log(this.$props.count);
            }
        }
    }
    
</script>
<style>
 .count{
    background-color: pink;
 }
</style>